//引入react
import React from 'react';
//引入react版的echarts
import Chart from 'rc-echarts';

//引入条形图组件
const BarEchart = function (props) {
    const barOption = {
        title : {
            show : true,
            text : '个人借阅量统计',
            textStype : {
                color : '#1c95ea'
            }
        },
        tooltip : {},
        legend : {
            data : ['借阅量']
        },
        xAxis : {
            data : props.data.name || '',
            name : '姓名',
            nameLocation : 'end',
            nameTextStyle : {
                color : '#1c95ea',
                fontWeight : 'bold'
            },
            nameGap : 30
        },
        yAxis : {
            name : '借阅量',
            nameLocation : 'end',
            nameTextStyle : {
                color : '#1c95ea',
                fontWeight : 'hold'
            },
            nameGap : 30
        }
    };

    const barSeries = {
        name : '借阅量',
        type : 'bar',
        data : props.data.count || '',
        itemStyle : {
            normal : {
                color : '#1c95ea',
                barBorderRadius : [5, 5, 0, 0]
            },
            emphasis : {
                color : '#045e9d'
            }
        },
        barGap : '50%'
    };

    return (
        <Chart {...barOption}>
            <Chart.bar {...barSeries} />
        </Chart>
    );
};

//导出条形图组件
export default BarEchart;